<template>
    <el-dialog :close-on-click-modal="false" :title="titleMap" v-model="visible" :width="600" destroy-on-close
        @closed="$emit('closed')">
        <el-form :model="form" :rules="rules" :disabled="mode == 'show'" ref="dialogForm" label-width="120px" label-position="right">
            <el-row>
                <el-col :span="24">
                    <el-form-item label="抗遗忘时间" prop="reviewTime">
                        <el-date-picker
                            style="width: 100%;"
                            clearable
                            v-model="form.reviewTime"
                            type="datetime"
                            value-format="YYYY-MM-DD HH:mm"
                            placeholder="选择抗遗忘时间"
                        >
                        </el-date-picker>
                    </el-form-item>
                    <el-form-item label="抗遗忘教练" prop="teacherId">
                        <el-select
                            style="width: 100%;"
                            v-model="form.teacherId"
                            filterable
                            remote
                            clearable
                            placeholder="请输入教练姓名搜索"
                            :remote-method="searchTeacherHander"
                            :loadings="teacherLoading">
                                <el-option
                                    v-for="item in teacherList"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id"
                                    >
                                </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <el-button @click="visible = false">取 消</el-button>
            <el-button type="primary" :loading="isSaveing" @click="submit(1)">更换本节课抗遗忘教练</el-button>
            <el-button type="warning" :loading="isSaveing" @click="submit(2)">一键更换所有抗遗忘教练</el-button>
        </template>
    </el-dialog>
</template>

<script>
export default {
    emits: ['success', 'closed'],
    data() {
        return {
            teacherLoading: false,
            titleMap: '更换抗遗忘教练',
            visible: false,
            isSaveing: false,
            //表单数据
            form: this.getDefaultRuleForm(),
            //验证规则
            rules: {
                name: [
                    { required: true, message: '请输入名称', trigger: 'blur' },
                ],
                teacherId: [
                    { required: true, message: '请选择教练', trigger: 'change' },
                ]
            },
            teacherList: []
        }
    },
    mounted() {
        this.searchTeacherHander()
    },
    methods: {
        //显示
        open(learnId) {
            this.form.learnId = learnId
            this.visible = true;
            return this
        },
        //表单提交方法
        submit(type) {
            this.$refs.dialogForm.validate(async (valid) => {
                if (!valid) {
                    return false
                }

                let data = {}
                for (let key in this.form) {
                    data[key] = this.form[key]
                }
                data.type = type

                try {
                    this.isSaveing = true;
                    await this.$API.reviewCycle.updateTeacher.put(data)
                    this.$emit('success')
                    this.visible = false;
                    this.$notify.success("提交成功")
                } finally {
                    this.isSaveing = false;
                }
            })
        },
        searchTeacherHander(query) {
            this.teacherLoading = true;
            let params = {
                name: query
            }
            this.$API.teacher.listByName.get(params).then((res) => {
                this.teacherList = res.data
            }).finally(() => {
                this.teacherLoading = false
            });
        },
        getDefaultRuleForm() {
            return {
                learnId: null,
                teacherId: '',
                reviewTime: ''
            }
        },
    }
}
</script>

<style>
</style>
